import React, {FC} from 'react';
import "./index.less";
import classNames from "classnames";

interface HxStListProps {
    title?: React.ReactNode;
    extra?: React.ReactNode;
    children?: React.ReactNode;
    className?: string;
    style?: React.CSSProperties;
}

const HxStList: FC<HxStListProps> = (props) => {
    const {title, extra, children, className, style} = props;
    return (
        <div className={classNames("hx-st-list-container", className)} style={style}>
            <div className={"hx-st-list-header"}>
                <div className={"hx-st-list-title"}>
                    {title}
                </div>
                <div className={"hx-st-list-extra"}>
                    {extra}
                </div>
            </div>
            <div className={"hx-st-list-content"}>
                {children}
            </div>
        </div>
    );
};

export default HxStList;